<style>
    
    .el-header, .el-footer {
    background-color: #B3C0D1;
    color: #333;
    text-align: center;
    line-height: 60px;
  }
  
  .el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    line-height: 200px;
  }
  
  .el-main {
    background-color: #ffffff;
    color: #333;
    text-align: center;
    line-height: 160px;
  }
  
  body > .el-container {
    margin-bottom: 40px;
  }
  
  .el-container:nth-child(5) .el-aside,
  .el-container:nth-child(6) .el-aside {
    line-height: 260px;
  }
  
  .el-container:nth-child(7) .el-aside {
    line-height: 320px;
  }
</style>
<template>
    <ContentWrap>
        <h3>安装预估</h3>
        <table style="width: 100%;margin-top: 20px;" class="gridtable spanFont">
                <tr>
                    <th style="width: 15%;">逆变器位置预估</th>
                    <td style="width: 30%;">
                        <el-radio-group v-model="localInstall.inverterPositionType">
                            <el-radio value="1">一楼外墙</el-radio>
                            <el-radio value="2">单元通道</el-radio>
                            <el-radio value="3">一楼室内</el-radio>
                            <el-radio value="4">其他<el-input class="no-border-input underline-input" style="width: 100%;" v-model="localInstall.remark"/></el-radio>
                        </el-radio-group>
                    </td>
                    <th style="width: 15%;">储能系统安装位置距离智能电表采集点距离</th>
                    <td style="width: 30%;">
                        <el-input class="no-border-input underline-input"  v-model="localInstall.distance"/><span>m</span>
                    </td>   
                </tr>
                <tr>
                    <th>电表箱位置预估</th>
                    <td>
                        <el-radio-group v-model="localInstall.meterBoxType">
                            <el-radio value="1">一楼外墙</el-radio>
                            <el-radio value="2">单元通道</el-radio>
                            <el-radio value="3">一楼室内</el-radio>
                            <el-radio value="4">其他<el-input class="no-border-input underline-input" style="width: 100%;" v-model="localInstall.remark"/></el-radio>
                        </el-radio-group>
                    </td>
                    <th>充电桩位置预估（可选）</th>
                    <td>
                        <el-input class="no-border-input underline-input" style="width: 100%;" v-model="localInstall.chargingPilePositionType"/>
                    </td>
                </tr>
                <tr>
                    <th>储能系统位置预估</th>
                    <td>
                        <el-radio-group v-model="localInstall.energyStoragePositionType">
                            <el-radio value="1">一楼外墙</el-radio>
                            <el-radio value="2">单元通道</el-radio>
                            <el-radio value="3">一楼室内</el-radio>
                            <el-radio value="4">其他<el-input class="no-border-input underline-input" style="width: 100%;" v-model="localInstall.remark"/></el-radio>
                        </el-radio-group>
                    </td>
                    <th>逆变器、并网箱、储能系统安装位置附近是否有燃气管道或其他易燃易爆物品</th>
                    <td>
                        <el-radio-group v-model="localInstall.dangerousGoods">
                            <el-radio value="1">是</el-radio>
                            <el-radio value="0">否</el-radio>
                        </el-radio-group>
                    </td>
                </tr>    
                <tr>
                    <th>支架接地距离人员活动范围预估</th>
                    <td>
                        <el-radio-group v-model="localInstall.bracketScopeType">
                            <el-radio value="1">极少</el-radio>
                            <el-radio value="2">偶尔</el-radio>
                            <el-radio value="3">经常，现场增加防护处理措施</el-radio>
                        </el-radio-group>
                    </td>
                    <th>特殊要求</th>
                    <td>
                        <el-select v-model="localInstall.specialRequirements" style="width: 100%;" placeholder="请选择场景" clearable class="!w-240px" >
                            <el-option v-for="dict in sceneList" :key="dict.value"
                                :label="dict.name" :value="dict.value" />
                        </el-select>
                        <el-radio-group v-model="localInstall.needElectricity" style="margin-left: 20px;" v-if="false">
                            <el-radio value="1">需要备电口</el-radio>
                            <el-radio value="0">不需要备电口</el-radio>
                        </el-radio-group>
                        <el-radio-group v-model="localInstall.needLineRun" style="margin-left: 20px;">
                            <el-radio value="1">需要线上运行</el-radio>
                            <el-radio value="0">不需要线上运行</el-radio>
                        </el-radio-group>
                    </td>
                </tr>   
                <tr>
                    <th>电表箱接地距离人员活动范围预估</th>
                    <td>
                        <el-radio-group v-model="localInstall.meterBoxScopeType">
                            <el-radio value="1">极少</el-radio>
                            <el-radio value="2">偶尔</el-radio>
                            <el-radio value="3">经常，现场增加防护处理措施</el-radio>
                        </el-radio-group>
                    </td>
                    <th>电缆敷设方式</th>
                    <td>
                        <el-radio-group v-model="localInstall.cableType">
                            <el-radio value="1">明敷</el-radio>
                            <el-radio value="2">暗敷</el-radio>
                        </el-radio-group>
                    </td>
                </tr>   
        </table>
        <h3 style="margin-top: 20px;" >图纸信息</h3>
        <el-row :gutter="20" style="margin-top: 20px;">
            <el-col :span="8">
                <div class="common-layout" >
                    <el-container>
                        <el-header>建筑图</el-header>
                        <el-main>
                            <UploadImgs :modelValue="modelValue"/>
                        </el-main>
                    </el-container>
                </div>
            </el-col>
            <el-col :span="8">
                <div class="common-layout" >
                    <el-container>
                        <el-header>结构图</el-header>
                        <el-main>
                            <UploadImgs :modelValue="modelValue"/>
                        </el-main>
                    </el-container>
                </div>
            </el-col>
            <el-col :span="8">
                <div class="common-layout" >
                    <el-container>
                        <el-header>电气一次系统图</el-header>
                        <el-main>
                            <UploadImgs :modelValue="modelValue"/>
                        </el-main>
                    </el-container>
                </div>
            </el-col>
        </el-row>
    </ContentWrap>
    
</template>
<script setup lang="ts">
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import * as ExplorationApi from '@/api/crm/exploration'

const modelValue = '';
const sceneList = [
    {value:1,name:"储能系统"},
    {value:2,name:"充电桩"},
    {value:3,name:"PVT光热系统"},
];
const size='small';
const props = defineProps<{
  install: ExplorationApi.ExplorationInstallVO;
}>();
const { install } = toRefs(props);
const localInstall = ref<ExplorationApi.ExplorationInstallVO>({ ...install.value });
watch(
  install,
  (newVal) => {
    localInstall.value = { ...newVal };
  },
  { deep: true } // 深度监听对象内部变化
);
// 5. 定义事件，向父组件传递修改后的数据
const emit = defineEmits<{
  (e: 'update:product', value: ExplorationApi.ExplorationInstallVO): void;
}>();

</script>
